import React, { useState, useRef, useEffect } from 'react';
import { Modal, Card, Tabs, Form, Checkbox, Input, Button, Space, Row, Col, DatePicker, Select, TimePicker, InputNumber } from 'antd';
import FormCondition from '@/components/FormCondition';

import { connect, } from 'umi';

const AnswerQaAmountForm = (props) => {
    const { visible = {}, onClose, dispatch, teacherId, fetchData } = props;
    const { show = false, detail = {},

    } = visible;
    const { id } = detail
    const [form] = Form.useForm();


    useEffect(() => {

    }, [])

    const formItems = [
        {
            label: `答疑次数`,
            name: 'amount',
            type: 'number'
        },
        {
            label: `标签`,
            name: 'tag',
            maxLength: 4,
        },
        {
            label: `原价`,
            name: 'oriPrice',
            type: 'number',
            extra: <Form.Item
                valuePropName={'checked'}
                name={'showPriceFlag'}
                required={false}
                label={'显示在前台'}
            >
                <Checkbox></Checkbox>
            </Form.Item>
        },
        {
            label: `现价`,
            name: 'price',
            type: 'number'
        },
        {
            label: `积分价格`,
            name: 'integralPrice',
            type: 'number'
        },
        {
            label: `有效期`,
            name: 'expiredDays',
            type: 'number'
        },
        {
            label: `每人限购`,
            rules: [{ required: false }],
            name: 'buyLimit',
        },
        {
            label: `平台限购`,
            rules: [{ required: false }],
            type: 'number',
            name: 'stock',
            extra: <Form.Item
                valuePropName={'checked'}
                name={'stockShowFlag'}
                required={false}
                label={'显示在前台'}
            >
                <Checkbox></Checkbox>
            </Form.Item>
        },



    ];

    const modalProps = {
        title: id ? `编辑答疑次数` : '新增答疑次数',
        width: 800,
        visible: typeof visible === 'boolean' ? visible : show,
        zIndex: 1001,
        destroyOnClose: true,
        okText: '确认',

    };
    useEffect(() => {

    }, [show])
    const submit = () => {
        form.validateFields().then((values) => {
            const { showPriceFlag, stockShowFlag } = values
            dispatch({
                type: 'answering/fakeSaveUserQaAmountPriceConfig',
                payload: {
                    ...values,
                    showPriceFlag: showPriceFlag ? '1' : '0',
                    stockShowFlag: stockShowFlag ? '1' : '0',
                    id
                },
                callback: (e) => {
                    onClose();
                    fetchData()
                }
            })
        });
    }

    return (
        <Modal
            {...modalProps}
            onCancel={onClose}
            onOk={() => {
                submit()
                // onClose();
            }}
        >
            <FormCondition formItemLayouts={
                {
                    labelCol: {

                    },
                    wrapperCol: {

                    },
                }
            }
                form={form} initialValues={detail} formItems={formItems}></FormCondition>
        </Modal>
    )
}


export default connect(({ order, loading }) => ({
    loading: loading.effects['answering/fakeSaveUserQaAmountPriceConfig'],
}))(AnswerQaAmountForm);
